<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>北京联合大学</title>
</head>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://at.alicdn.com/t/font_835526_stt0bsac8o.css">
<link rel="stylesheet" href="../../css/Initialization.css">
<link rel="stylesheet" href="../../css/commen.css">
<link rel="stylesheet" href="../../css/unit.css">
<body>
<div id="content">
    <div class="initer">
            <!-- 单元知识点 具体内容 -->
            <div class="bread">
                <div class="plain">
                    分组信息
                </div>
                <div class="plain">
                    <i class="iconfont icon-right"></i>
                </div>
                <div class="plain current">
                    小组列表
                </div>
            </div>
            <div class="teamlists">
                <ul>
                    <li class="teamlist" th:each="item : ${groups}">
                        <span><i class="icon-dian iconfont"></i> <span th:text="${item.groupname}" id="groupname">打造世界500强</span></span>
                        <div class="centerperson">
                            <span><b th:text="${item.groupcount}">5</b>人</span>
                            <span th:text="${item.foundername}">李国庆</span>
                        </div>
                        <a class="min-button" href="javascript:void(0)" id="joinGroup" th:onclick="'javascript:joinGroup(\''+${item.id}+'\',this)'">加入小组</a>
                    </li>

                </ul>
            </div>
            <!-- 分页 -->
            <!--div class="pages">
                <div class="page prve">
                    <i class="icon-fanhui1 iconfont fan"></i>
                </div>
                <div class="page pageactive pagenumber" id='active' data-number='1'>1</div>
                <div class="page pagenumber" data-number='2'>2</div>
                <div class="page pagenumber">3</div>
                <div class="page pagenumber">4</div>
                <div class="page pagenumber">...</div>
                <div class="page pagenumber" data-number='23'>23</div>
                <div class="page next">
                    <i class="icon-youjiantou2 iconfont"></i>
                </div>
            </div-->
            <!-- 确认加入小组 -->
            <div class="mask none">
                <div class="sureteam">
                    <div class="title">
                        确认加入小组
                    </div>
                    <div class="teamcenter">
                        <div class="teamdesc_tip" id="resultmessage">
                            你将加入一个“<span id="showname">打造世界五百强</span>”小组，加入后将不能退出，是否确认加入
                        </div>
                        <div class="surebtns">
                            <input type="hidden" id="groupid" name="groupid"/>
                            <div class="center-button" id="yesjoin">确认加入</div>
                            <div class="center-button" id="nojoin">暂不加入</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</div>
<script src="../../js/jquery-3.4.1.min.js"></script>
<script src="../../js/commen.js"></script>
<script>
    function joinGroup(id,obj) {
        var groupname = $(obj).parent().find("#groupname").html();
        $("#showname").html(groupname);
        $("#groupid").val(id);
        $('.mask').removeClass('none');
    }

    function change(json){
        $("#resultmessage").html(json.result);
        $("#yesjoin").hide();
        $("#nojoin").html("确定");
        if(json.state == success){
            $("#nojoin").click(function () {
                location.href = "groupInfo";
            });
        }else{
            $("#nojoin").click(function () {
                $('.mask').addClass('none');
            });
        }
    }

    $(function () {
        $("#nojoin").click(function () {
            $('.mask').addClass('none');
        });

        $("#yesjoin").click(function () {
            var groupid = $("#groupid").val();
            $.ajax({
                type : "POST",
                url : "joinGroup",
                data : {groupid: groupid},
                dataType : "json",
                success : function(json) {
                    alert(json.result)
                    if(json.state == success){
                        location.href = "../person/information"
                    }
                },
                error:function(msg){
                    alert("程序出错，请联系管理员");
                }
            });
        });
    })
</script>
</body>
</html>

